// JobAlumnuInfo.js
import React from 'react'
import PropTypes from 'prop-types'
import { View, Text, Image, Dimensions, StyleSheet } from 'react-native'
import LinearGradient from 'react-native-linear-gradient'
import { ScaleS, ScaleT } from 'src/utils/ScreenUtil'
import CustomTextEllipsize from '../../../../components/custom-text-ellipsize/index'
import CustomImage from '../../../../components/image/CustomImage'
import { companyDefaultLogo } from '../../../../utils/ConfigUtil'
import CustomButton from '../../../../components/button/CustomButton'
import DefaultImage from '../../../../components/image/DefaultImage'

const SCREENW = Dimensions.get('window').width

export default class JobCompanyInfo extends React.PureComponent {
  constructor (props) {
    super(props)
    this.state = {
      companyLogo: { uri: props.data.companyLogo }
    }
  }

  static propTypes = {
    data: PropTypes.object,
    onPress: PropTypes.func,
    size: PropTypes.number
  }

  render () {
    const { data, onPress, size } = this.props
    return (
      <CustomButton params={data} onPress={onPress}>
        <LinearGradient
          colors={['#65D797', '#5DC9C5']}
          style={styles.container}>
          <DefaultImage style={styles.logo} source={this.state.companyLogo} defaultSource={companyDefaultLogo} />
          <View style={styles.middle}>
            <CustomTextEllipsize style={styles.name} text={data.simpleName || data.companyName} />
            <View style={styles.tagCont}>
              {
                false &&
                <LinearGradient
                  start={{ x: 0, y: 0 }}
                  end={{ x: 1, y: 0 }}
                  colors={['rgba(64, 68, 74, 0.35)', 'rgba(116, 121, 129, 0.35)']}
                  style={[styles.tagBg, styles.tagBg1]}>
                  <Image style={styles.crown} source={require('@/imgC/home/crown.png')} />
                  <Text style={styles.tagtext}>名企</Text>
                </LinearGradient>
              }
              <LinearGradient
                start={{ x: 0, y: 0 }}
                end={{ x: 1, y: 0 }}
                colors={['rgba(64, 68, 74, 0.35)', 'rgba(116, 121, 129, 0.35)']}
                style={[styles.tagBg, styles.tagBg2]}>
                <Text style={styles.tagtext}>{`${data.postCount}个职位`}</Text>
              </LinearGradient>
            </View>
          </View>
          {size === 5 && <CustomImage style={styles.triangle} source={require('@/imgC/home/triangle_white.png')} />}
        </LinearGradient>
      </CustomButton>
    )
  }

  _onLoadError = () => {
    this.setState({
      companyLogo: companyDefaultLogo
    })
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    marginTop: ScaleS(23),
    marginHorizontal: ScaleS(20),
    paddingLeft: ScaleS(13),
    paddingRight: ScaleS(24),
    width: SCREENW - ScaleS(40),
    height: ScaleS(95),
    flexDirection: 'row',
    alignItems: 'center',
    borderRadius: ScaleS(13)
  },
  logo: {
    width: ScaleS(48),
    height: ScaleS(48),
    borderRadius: ScaleS(24),
    resizeMode: 'cover'
  },
  middle: {
    flex: 1,
    marginLeft: ScaleS(18),
    justifyContent: 'space-between'
  },
  name: {
    height: ScaleS(25),
    fontSize: ScaleT(20),
    color: '#ffffff',
    fontWeight: '600',
    lineHeight: ScaleS(25)
  },
  tagCont: {
    marginTop: ScaleS(9),
    marginLeft: ScaleS(2),
    flexDirection: 'row',
    alignItems: 'center'
  },
  tagBg: {
    marginRight: ScaleS(9),
    height: ScaleS(20),
    borderRadius: ScaleS(10),
    flexDirection: 'row',
    justifyContent: 'center',
    alignItems: 'center'
  },
  tagBg1: {
    width: ScaleS(52)
  },
  crown: {
    width: ScaleS(15),
    resizeMode: 'cover',
    marginRight: ScaleS(2)
  },
  tagBg2: {
    width: ScaleS(58)
  },
  tagtext: {
    fontWeight: '400',
    color: '#FCF4C4',
    fontSize: ScaleT(10)
  },
  triangle: {
    alignSelf: 'flex-start',
    marginTop: ScaleS(30),
    width: ScaleS(5),
    height: ScaleS(6)
  }
})
